
window.onload = function () {
    var registerForm = document.querySelector('#register');
    var register_username = document.querySelector('#register_username');
    var register_password = document.querySelector('#register_password');
    var register_confirm_password = document.querySelector('#register_confirm_password');
    var register_btn = document.querySelector('#register_btn');
    var loginForm = document.querySelector('#login')
    var login_username = document.querySelector('#login_username');
    var login_password = document.querySelector('#login_password');
    var login_btn = document.querySelector('#login_btn');
    var yes_no_1 = document.querySelector('.yes_no_1');
    var yes_no_2 = document.querySelector('.yes_no_2');
    var nihao_1 = document.querySelector('.nihao_1');
    var nihao_2 = document.querySelector('.nihao_2');
    var confirm = document.querySelector('.confirm');
    var tixing_box = document.querySelector('.tixing_box');
    var tixing_text = document.querySelector('.tixing_text');
    var tixing = document.querySelector('.tixing');
    var close = document.querySelector('.close');
    var ewm = document.querySelector('.ewm');
    var ewm_zhaopian = document.querySelector('.ewm_zhaopian');
    var phone_regex = /^1[3-9]\d{9}$/;
    var password_regex = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/;
    var daojishi = document.querySelector('.daojishi');
    input_yes_no(register_username, phone_regex, yes_no_1, nihao_1);
    input_yes_no(register_password, password_regex, yes_no_2, nihao_2);
    register_btn.addEventListener('click', function () {
        if (localStorage.getItem('AdminData') == null) {
            localStorage.setItem('AdminData', '[]');
        }
        daojishi.style.display = 'block';
        tixing_box.style.display = 'block';
        tixing_text.style.color = 'red';
        if (phone_regex.test(register_username.value) && password_regex.test(register_password.value) && (register_password.value == register_confirm_password.value) && !check_username_no_repeat(register_username.value)) {
            function firstFunction() {
                var dataArray = [];
                var json = {};
                if (localStorage.AdminData != null) {
                    dataArray = load();
                }
                json.username = register_username.value
                json.password = register_password.value
                dataArray.push(json);
                save(dataArray);

                tixing_text.innerHTML = '恭喜注册账号成功！';
                daojishi.style.display = 'block';
                function countdown() {
                    var seconds = 5;
                    setInterval(function () {
                        seconds = seconds - 1;
                        if (seconds > 0) {
                            daojishi.innerHTML = '将在' + seconds + '秒后返回登录页面！';
                        } else {
                            clearInterval();
                        }
                    }, 1000);
                }
                countdown();
            }
            firstFunction();
            close.addEventListener('click', function () {
                tixing_box.style.display = 'none';
                secondFunction()
            })
            confirm.addEventListener('click', function () {
                tixing_box.style.display = 'none';
                secondFunction()
            })
            function secondFunction() {
                register_btn.setAttribute('type', 'submit');
                registerForm.submit();
            }
            setTimeout(secondFunction, 5000);
        } else if (register_username.value == '') {
            tixing_text.innerHTML = '注册的手机号码不能为空！';
            daojishi.innerHTML = '请输入正确的11位手机号码!';
        } else if (!phone_regex.test(register_username.value)) {
            tixing_text.innerHTML = '注册的手机号码格式错误！';
            daojishi.innerHTML = '请输入正确的11位手机号码!';
        } else if (register_password.value == '') {
            tixing_text.innerHTML = '注册的密码不能为空！';
            daojishi.innerHTML = '请输入至少含有一个字母的6到16位密码!';
        } else if (!password_regex.test(register_password.value)) {
            tixing_text.innerHTML = '注册的密码格式错误！';
        } else if (register_confirm_password.value == '') {
            tixing_text.innerHTML = '注册的确定密码不能为空！';
            daojishi.innerHTML = '请输入至少含有一个字母的6到16位密码!';
        } else if ((register_confirm_password.value != '') && (register_password.value != register_confirm_password.value)) {
            tixing_text.innerHTML = '两次输入的密码不一致！';
            daojishi.innerHTML = '请输入至少含有一个字母的6到16位密码!';
        } else {
            tixing_text.innerHTML = '注册的账号已存在！';
            function countdown() {
                var seconds = 5;
                setInterval(function () {
                    seconds = seconds - 1;
                    if (seconds > 0) {
                        daojishi.innerHTML = '将在' + seconds + '秒后返回登录页面！';
                    } else {
                        clearInterval();
                    }
                }, 1000);
            }
            countdown();
            close.addEventListener('click', function () {
                location.reload();
            })
            confirm.addEventListener('click', function () {
                location.reload();
            })
            function secondFunction() {
                location.reload();
            }
            setTimeout(secondFunction, 5000);
        }
    })
    login_btn.addEventListener('click', function () {
        if (localStorage.getItem('AdminData') == null) {
            localStorage.setItem('AdminData', '[]');
        }
        tixing_text.style.color = 'red';
        tixing_box.style.display = 'block';
        daojishi.style.display = 'block';
        if (phone_regex.test(login_username.value) && password_regex.test(login_password.value) && check_username_no_repeat(login_username.value) && password_correct(login_username.value, login_password.value)) {
            tixing_box.style.display = 'none';
            daojishi.style.display = 'none';
            window.location.href = "website/HomePage.html";
        } else if (login_username.value == '') {
            tixing_text.innerHTML = '登录的手机号码不能为空！';
            daojishi.innerHTML = '请输入正确的11位手机号码!';
        } else if (!phone_regex.test(login_username.value)) {
            tixing_text.innerHTML = '登录的手机号码格式错误！';
            daojishi.innerHTML = '请输入正确的11位手机号码!';
        } else if (login_password.value == '') {
            tixing_text.innerHTML = '登录的密码不能为空！';
            daojishi.innerHTML = '请输入至少含有一个字母的6到16位密码!';
        } else if (!password_regex.test(login_password.value)) {
            tixing_text.innerHTML = '登录的密码格式错误！';
            daojishi.innerHTML = '请输入至少含有一个字母的6到16位密码!';
        } else if (!check_username_no_repeat(login_username.value)) {
            tixing_text.innerHTML = '登录的账号不存在！';
            daojishi.innerHTML = '请前去注册!';
            close.addEventListener('click', function () {
                location.reload();
            })
            confirm.addEventListener('click', function () {
                location.reload();
            })
        } else {
            tixing_text.innerHTML = '密码输入错误！';
            daojishi.innerHTML = '请输入正确密码!';
        }
    })
    var login_form = document.querySelector('.login_form');
    var register_form = document.querySelector('.register_form');
    var login_exist = document.querySelector('.login_exist');
    var login_exist_submit = document.querySelector('.login_exist_submit');
    var register_exist = document.querySelector('.register_exist');
    var register_exist_submit = document.querySelector('.register_exist_submit');
    register_exist_submit.addEventListener('click', function () {
        register_exist.style.display = 'none';
        register_form.style.display = 'block';
        login_form.style.display = 'none';
        login_exist.style.display = 'block';
        left_animate(login_exist, 100);
        right_animate(register_form, 500);
        login_exist_submit.style.disabled = 'none';
        register_exist.style.left = '100px';
        login_form.style.left = '500px';
        login_exist.style.background = 'linear-gradient(to bottom, white, #3975f2);'
    })
    login_exist_submit.addEventListener('click', function () {
        login_exist.style.display = 'none';
        login_form.style.display = 'block';
        register_form.style.display = 'none';
        register_exist.style.display = 'block';
        right_animate(register_exist, 500);
        left_animate(login_form, 100);
        login_exist.style.left = '500px';
        register_form.style.left = '100px';
    })
    confirm.addEventListener('click', function () {
        tixing_box.style.display = 'none';
    })
    close.addEventListener('click', function () {
        tixing_box.style.display = 'none';
    })
    tixing.addEventListener('mousedown', function (e) {
        tixing.style.cursor = 'move';
        var x = e.pageX - tixing.offsetLeft;
        var y = e.pageY - tixing.offsetTop;
        document.addEventListener("mousemove", move)
        function move(e) {
            tixing.style.left = e.pageX - x + 'px';
            tixing.style.top = e.pageY - y + 'px';
        }
        document.addEventListener('mouseup', function () {
            tixing.style.cursor = 'default';
            document.removeEventListener('mousemove', move)
        })
    })
    confirm.addEventListener('click', function () {
        tixing.style.left = '38%';
        tixing.style.top = '488px';
    })
    ewm.addEventListener('mouseenter', function () {
        ewm_zhaopian.style.display = 'block';
    })
    ewm.addEventListener('mouseleave', function () {
        ewm_zhaopian.style.display = 'none';
    })
    document.querySelectorAll('input').forEach(function (input) {
        input.addEventListener('focus', function () {
            this.style.border = "2px solid black";
            this.style.borderRadius = '7px';
        });
        input.addEventListener('blur', function () {
            this.style.border = "1px solid #bbbbbb";
            this.style.borderRadius = '0';
        })
    });
    var menu_tabs = document.querySelectorAll('#menu-tab');
    menu_tabs.forEach(element => {
        element.addEventListener('click', function () {
            tixing_text.innerHTML = '请登录账号！';
            daojishi.style.display = 'none';
            tixing_box.style.display = 'block';
        })
    });
}

function input_yes_no(obj1, regex, change_obj, obj2) {
    obj1.addEventListener('input', function (e) {
        e.preventDefault();
        if (obj1.value === '') {
            change_obj.innerHTML = "";
            obj2.innerHTML = '';
        } else {
            if (!(regex.test(obj1.value))) {
                change_obj.innerHTML = "&#xe630;";
                change_obj.className = "change_obj no";
                if (obj1 === register_username) {
                    obj2.innerHTML = '错误!请输入正确的11位手机号码!';
                } else { obj2.innerHTML = '错误!请输入至少含有一个字母的6到16位密码!'; }
            } else {
                change_obj.innerHTML = "&#xe631;";
                change_obj.className = "change_obj yes";
                obj2.innerHTML = '';
            }
        }
    });
}

function right_animate(obj, distance) {
    var timer = setInterval(function () {
        if (obj.offsetLeft >= distance) {
            clearInterval(timer);
        } else { obj.style.left = obj.offsetLeft + 10 + 'px'; }
    }, 5)
}

function left_animate(obj, distance) {
    var timer = setInterval(function () {
        if (obj.offsetLeft <= distance) {
            clearInterval(timer);
        } else { obj.style.left = obj.offsetLeft - 10 + 'px'; }
    }, 5)
}
function save(arr) {
    localStorage.AdminData = JSON.stringify(arr);
}

function load() {
    return JSON.parse(localStorage.AdminData);
}

function check_username_no_repeat(username) {
    for (var i = 0; i < load().length; i++) {
        if (load()[i].username == username) {
            return true;
        }
    }
    return false;
}
function password_correct(username, password) {
    for (var i = 0; i < load().length; i++) {
        if (load()[i].username == username) {
            if (load()[i].password == password) {
                return true;
            }
        }
    }
    return false;
}

